-
Notifications
You must be signed in to change notification settings - Fork 2.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
chore: run migration for @fluentui/babel-make-styles #20744
Conversation
📊 Bundle size report🤖 This report was generated against 8a141d14f3a14de2e1c4691dad908622f310a9d1 |
This pull request is automatically built and testable in CodeSandbox. To see build info of the built libraries, click here or the icon next to each commit SHA. Latest deployment of this branch, based on commit 48d25ff:
|
Asset size changesSize Auditor did not detect a change in bundle size for any component! Baseline commit: 4ea5942620567cd58687002b35a471333761b8df (build) |
I guess that we don't have DOM typings in this case as this package is Node only. |
Perf Analysis (
|
Scenario | Render type | Master Ticks | PR Ticks | Iterations | Status |
---|---|---|---|---|---|
Avatar | mount | 1214 | 1274 | 5000 | |
BaseButton | mount | 1238 | 1248 | 5000 | |
Breadcrumb | mount | 3062 | 3047 | 1000 | |
ButtonNext | mount | 752 | 755 | 5000 | |
Checkbox | mount | 1942 | 1930 | 5000 | |
CheckboxBase | mount | 1666 | 1683 | 5000 | |
ChoiceGroup | mount | 5563 | 5570 | 5000 | |
ComboBox | mount | 1252 | 1258 | 1000 | |
CommandBar | mount | 11151 | 11243 | 1000 | |
ContextualMenu | mount | 9462 | 9476 | 1000 | |
DefaultButton | mount | 1481 | 1510 | 5000 | |
DetailsRow | mount | 4499 | 4505 | 5000 | |
DetailsRowFast | mount | 4453 | 4415 | 5000 | |
DetailsRowNoStyles | mount | 4277 | 4253 | 5000 | |
Dialog | mount | 2936 | 2974 | 1000 | |
DocumentCardTitle | mount | 342 | 354 | 1000 | |
Dropdown | mount | 3811 | 3865 | 5000 | |
FluentProviderNext | mount | 4262 | 4261 | 5000 | |
FluentProviderWithTheme | mount | 421 | 399 | 10 | |
FluentProviderWithTheme | virtual-rerender | 283 | 284 | 10 | |
FluentProviderWithTheme | virtual-rerender-with-unmount | 449 | 435 | 10 | |
FocusTrapZone | mount | 2224 | 2122 | 5000 | |
FocusZone | mount | 2182 | 2218 | 5000 | |
IconButton | mount | 2249 | 2242 | 5000 | |
Label | mount | 556 | 562 | 5000 | |
Layer | mount | 3494 | 3469 | 5000 | |
Link | mount | 744 | 730 | 5000 | |
MakeStyles | mount | 2141 | 2184 | 50000 | |
MenuButton | mount | 1858 | 1855 | 5000 | |
MessageBar | mount | 2361 | 2364 | 5000 | |
Nav | mount | 3895 | 3891 | 1000 | |
OverflowSet | mount | 1388 | 1427 | 5000 | |
Panel | mount | 2854 | 2864 | 1000 | |
Persona | mount | 1128 | 1117 | 1000 | |
Pivot | mount | 1770 | 1757 | 1000 | |
PrimaryButton | mount | 1626 | 1639 | 5000 | |
Rating | mount | 9179 | 9169 | 5000 | |
SearchBox | mount | 1738 | 1738 | 5000 | |
Shimmer | mount | 3087 | 3117 | 5000 | |
Slider | mount | 2352 | 2421 | 5000 | |
SpinButton | mount | 5793 | 5761 | 5000 | |
Spinner | mount | 643 | 628 | 5000 | |
SplitButton | mount | 3774 | 3702 | 5000 | |
Stack | mount | 724 | 730 | 5000 | |
StackWithIntrinsicChildren | mount | 2168 | 2217 | 5000 | |
StackWithTextChildren | mount | 5614 | 5614 | 5000 | |
SwatchColorPicker | mount | 11989 | 11954 | 5000 | |
TagPicker | mount | 3163 | 3193 | 5000 | |
TeachingBubble | mount | 14323 | 14333 | 5000 | |
Text | mount | 622 | 681 | 5000 | |
TextField | mount | 1735 | 1806 | 5000 | |
ThemeProvider | mount | 1457 | 1454 | 5000 | |
ThemeProvider | virtual-rerender | 825 | 825 | 5000 | |
ThemeProvider | virtual-rerender-with-unmount | 2270 | 2308 | 5000 | |
Toggle | mount | 1134 | 1110 | 5000 | |
buttonNative | mount | 307 | 319 | 5000 |
Perf Analysis (@fluentui/react-northstar
)
Perf tests with no regressions
Scenario | Current PR Ticks | Baseline Ticks | Ratio |
---|---|---|---|
FlexMinimalPerf.default | 383 | 334 | 1.15:1 |
TreeWith60ListItems.default | 222 | 200 | 1.11:1 |
ButtonMinimalPerf.default | 228 | 208 | 1.1:1 |
ButtonSlotsPerf.default | 659 | 605 | 1.09:1 |
ChatDuplicateMessagesPerf.default | 356 | 329 | 1.08:1 |
ImageMinimalPerf.default | 473 | 438 | 1.08:1 |
BoxMinimalPerf.default | 422 | 398 | 1.06:1 |
HeaderMinimalPerf.default | 440 | 420 | 1.05:1 |
TextMinimalPerf.default | 411 | 393 | 1.05:1 |
AlertMinimalPerf.default | 330 | 317 | 1.04:1 |
CarouselMinimalPerf.default | 556 | 537 | 1.04:1 |
ListWith60ListItems.default | 762 | 733 | 1.04:1 |
LoaderMinimalPerf.default | 784 | 757 | 1.04:1 |
CardMinimalPerf.default | 681 | 659 | 1.03:1 |
HeaderSlotsPerf.default | 913 | 890 | 1.03:1 |
MenuMinimalPerf.default | 996 | 971 | 1.03:1 |
PortalMinimalPerf.default | 197 | 192 | 1.03:1 |
ReactionMinimalPerf.default | 458 | 445 | 1.03:1 |
RefMinimalPerf.default | 263 | 255 | 1.03:1 |
StatusMinimalPerf.default | 799 | 774 | 1.03:1 |
DialogMinimalPerf.default | 863 | 843 | 1.02:1 |
DropdownManyItemsPerf.default | 816 | 797 | 1.02:1 |
FormMinimalPerf.default | 512 | 503 | 1.02:1 |
LabelMinimalPerf.default | 458 | 449 | 1.02:1 |
LayoutMinimalPerf.default | 429 | 422 | 1.02:1 |
RadioGroupMinimalPerf.default | 527 | 519 | 1.02:1 |
SegmentMinimalPerf.default | 417 | 410 | 1.02:1 |
TextAreaMinimalPerf.default | 616 | 601 | 1.02:1 |
VideoMinimalPerf.default | 729 | 717 | 1.02:1 |
CheckboxMinimalPerf.default | 2977 | 2960 | 1.01:1 |
DropdownMinimalPerf.default | 3278 | 3238 | 1.01:1 |
EmbedMinimalPerf.default | 4630 | 4581 | 1.01:1 |
GridMinimalPerf.default | 385 | 381 | 1.01:1 |
InputMinimalPerf.default | 1433 | 1422 | 1.01:1 |
ListCommonPerf.default | 765 | 760 | 1.01:1 |
PopupMinimalPerf.default | 653 | 647 | 1.01:1 |
ProviderMergeThemesPerf.default | 1868 | 1843 | 1.01:1 |
SplitButtonMinimalPerf.default | 4822 | 4780 | 1.01:1 |
TableManyItemsPerf.default | 2214 | 2192 | 1.01:1 |
TableMinimalPerf.default | 473 | 468 | 1.01:1 |
CustomToolbarPrototype.default | 4474 | 4435 | 1.01:1 |
TooltipMinimalPerf.default | 1192 | 1183 | 1.01:1 |
ChatMinimalPerf.default | 786 | 789 | 1:1 |
ChatWithPopoverPerf.default | 444 | 446 | 1:1 |
DividerMinimalPerf.default | 435 | 435 | 1:1 |
ListMinimalPerf.default | 613 | 610 | 1:1 |
MenuButtonMinimalPerf.default | 1893 | 1888 | 1:1 |
SliderMinimalPerf.default | 1863 | 1857 | 1:1 |
ToolbarMinimalPerf.default | 1101 | 1099 | 1:1 |
TreeMinimalPerf.default | 929 | 930 | 1:1 |
AttachmentMinimalPerf.default | 204 | 206 | 0.99:1 |
AttachmentSlotsPerf.default | 1207 | 1216 | 0.99:1 |
ButtonOverridesMissPerf.default | 1878 | 1890 | 0.99:1 |
DatepickerMinimalPerf.default | 6132 | 6181 | 0.99:1 |
RosterPerf.default | 1389 | 1406 | 0.99:1 |
AvatarMinimalPerf.default | 234 | 239 | 0.98:1 |
ItemLayoutMinimalPerf.default | 1399 | 1424 | 0.98:1 |
SkeletonMinimalPerf.default | 409 | 416 | 0.98:1 |
IconMinimalPerf.default | 727 | 740 | 0.98:1 |
AnimationMinimalPerf.default | 468 | 485 | 0.96:1 |
ListNestedPerf.default | 660 | 686 | 0.96:1 |
AccordionMinimalPerf.default | 181 | 191 | 0.95:1 |
ProviderMinimalPerf.default | 1269 | 1331 | 0.95:1 |
for this scenario you need to add following to "compilerOptions": {
"noEmit": false,
- "lib": ["ES2019"],
+ "lib": ["DOM","ES2019"],
"outDir": "dist",
"declaration": true,
- "types": ["static-assets", "environment"],
+ "types": ["static-assets", "environment", "inline-style-expand-shorthand"],
"module": "CommonJS"
}, ideally the generator should check if a node library has from experience this is a corner case and shouldn't happen - instead dependencies should be decoupled into separate libraries so we can have dep graph like following: |
Co-authored-by: Martin Hochel <[email protected]>
Thanks! Was thinking about the same, but was not sure that it's acceptable solution 👍 |
* chore: run migration for @fluentui/babel-make-styles * Change files * Apply suggestions from code review Co-authored-by: Martin Hochel <[email protected]> * fix fmt * restore change in jest config Co-authored-by: Martin Hochel <[email protected]>
Pull request checklist
$ yarn change
Description of changes
package.json#scripts
(migrate-converged-pkg: adds Storybook scripts for Node packages #20745).babelrc
(migrate-converged-pkg: adds .babelrc for Node packages #20746)